<!--
  -    Copyright (c) 2018-2025, infomng All rights reserved.
  -
  - Redistribution and use in source and binary forms, with or without
  - modification, are permitted provided that the following conditions are met:
  -
  - Redistributions of source code must retain the above copyright notice,
  - this list of conditions and the following disclaimer.
  - Redistributions in binary form must reproduce the above copyright
  - notice, this list of conditions and the following disclaimer in the
  - documentation and/or other materials provided with the distribution.
  - Neither the name of the pig4cloud.com developer nor the names of its
  - contributors may be used to endorse or promote products derived from
  - this software without specific prior written permission.
  - Author: infomng
  -->
<template>
  <div class="execution">
    <basic-container>
      <avue-crud
        ref="crud"
        :page.sync="page"
        :data="tableData"
        :permission="permissionList"
        :table-loading="tableLoading"
        :option="tableOption"
        @on-load="getList"
        @search-change="searchChange"
        @refresh-change="refreshChange"
        @size-change="sizeChange"
        @current-change="currentChange"
        @row-update="handleUpdate"
        @row-save="handleSave"
        @row-del="handleDel">
        <template slot="menuLeft">
<!--          <el-button
            v-if="permissions.pfoc_craftproductline_export"
            class="filter-item"
            plain
            type="primary"
            size="small"
            icon="el-icon-download"
            @click="exportExcel">导出
          </el-button>-->
          <el-button type="primary" icon="el-icon-plus" @click="addCraft">产品工艺流程建模</el-button>
        </template>
        <template slot-scope="scope" slot="menu">
          <el-button type="text"  icon="el-icon-s-release"  size="small" plain  @click="productRelease(scope.row,scope.index)">产品发布</el-button>
<!--
          <el-button type="text"  icon="el-icon-circle-plus-outline"  size="small" plain  @click=" $refs.crud.rowCell(scope.row, scope.index)">添加品号</el-button>
-->
          <el-button type="text"  icon="el-icon-view"  size="small" plain  @click="handleView(scope.row,scope.index)">预览</el-button>
          <el-button type="text"  icon="el-icon-edit"  size="small" plain  @click="editCraft(scope.row)">编辑</el-button>
          <el-button type="text"  icon="el-icon-delete"  size="small" plain  @click="handleDel(scope.row,scope.index)">删除</el-button>
        </template>
      </avue-crud>

      <!--新增弹窗页面-->
      <el-dialog title=""
                 :visible.sync="addDialogVisible"
                 width="50%"
                 v-if="addDialogVisible"
                 lock-scroll
                 :fullscreen="addDialogFull">

        <template slot="title">
          <div class="avue-crud__dialog__header">
                            <span class="el-dialog__title">
                                <span style="display:inline-block;background-color: #3478f5;width:3px;height:20px;margin-right:5px; float: left;margin-top:2px"></span>
                                产品工艺流程建模
                            </span>
            <!--  <div class="avue-crud__dialog__menu" style="margin-top: -7px;margin-right: 10px;" @click="planDetailsDialogFull? planDetailsDialogFull=false: planDetailsDialogFull=true">
                <i class="el-icon-full-screen"></i>
              </div>-->
          </div>
        </template>
        <!--新增工艺产线页面-->
        <addProduct ref="addCraftRef" @closeAddCraft="closeAddCraft" :productLineTypeList="productLineTypeList"/>
      </el-dialog>

      <!--修改弹窗页面-->
      <el-dialog title=""
                 :visible.sync="editDialogVisible"
                 width="50%"
                 lock-scroll
                 v-if="editDialogVisible"
                 :fullscreen="editDialogFull">
        <el-backtop target=".el-card__body .el-dialog__wrapper .el-dialog" :right="15" :bottom="20" :visibility-height="1" />
        <template slot="title">
          <div class="avue-crud__dialog__header">
                            <span class="el-dialog__title">
                                <span style="display:inline-block;background-color: #3478f5;width:3px;height:20px;margin-right:5px; float: left;margin-top:2px"></span>
                                修改产品工艺流程建模
                            </span>
            <!--  <div class="avue-crud__dialog__menu" style="margin-top: -7px;margin-right: 10px;" @click="planDetailsDialogFull? planDetailsDialogFull=false: planDetailsDialogFull=true">
                <i class="el-icon-full-screen"></i>
              </div>-->
          </div>
        </template>
   <!--     <div class="pull-auto"  style="text-align: left;margin-left: 40px;font-size: 16px;color:#3478f5">
          <div class="block">
            品号：{{articleNumber}} <i class="el-breadcrumb__separator el-icon-arrow-right"></i>工艺产线名称：{{craftLineName}}
          </div>
          <div class="block">

          </div>
        </div>-->
        <!--修改工艺产线页面-->
        <editProduct ref="editCraftRef" @closeEditCraft="closeEditCraft" :productProcessId="id" :productLineTypeList="productLineTypeList"/>
      </el-dialog>

      <!--预览弹窗页面-->
      <el-dialog title=""
                 :visible.sync="viewDialogVisible"
                 width="50%"
                 lock-scroll
                 v-if="viewDialogVisible"
                 :fullscreen="viewDialogFull">
        <el-backtop target=".el-card__body .el-dialog__wrapper .el-dialog" :right="15" :bottom="20" :visibility-height="1" />
        <template slot="title">
          <div class="avue-crud__dialog__header">
              <span class="el-dialog__title">
                  <span style="display:inline-block;background-color: #3478f5;width:3px;height:20px;margin-right:5px; float: left;margin-top:2px"></span>
                  产品工艺流程建模预览
              </span>
          </div>
        </template>
        <!--预览工艺产线页面-->
        <viewProduct ref="viewCraftRef"  :productProcessId="id" :productLineTypeList="productLineTypeList"/>
      </el-dialog>

    </basic-container>
  </div>
</template>

<script>
import { fetchList, addObj, putObj, delObj, productProductionRelease} from '@/api/pfoc/craftproductline'
import { tableOption } from '@/const/crud/pfoc/craftproductline'
import { mapGetters } from 'vuex'
import { remote} from '@/api/admin/dict' //获取产品类型
/**引入新增工艺产线页面*/
import addProduct from '@/views/pfoc/craftproductline/add-product-process'
/**引入修改工艺产线页面*/
import editProduct from '@/views/pfoc/craftproductline/edit-product-process'
/**引入预览工艺产线页面*/
import viewProduct from '@/views/pfoc/craftproductline/view-product-process'
export default {
      name: 'craftproductline',
      components: {
          //新增工艺产线页面
          addProduct,
          //修改工艺产线页面
          editProduct,
          //预览工艺产线页面
          viewProduct,
      },
      data() {
        return {
          searchForm: {},
          tableData: [],
          page: {
            total: 0, // 总页数
            currentPage: 1, // 当前页数
            pageSize: 20 // 每页显示多少条
          },
          tableLoading: false,
          tableOption: tableOption,
          addDialogVisible:false,//新增工艺产线页面开关
          addDialogFull:true,//新增工艺产线页面弹窗缩放开关（默认放大）
          editDialogVisible:false,//修改工艺产线页面开关
          editDialogFull:true,//修改工艺产线页面弹窗缩放开关（默认放大）
          viewDialogVisible:false,//预览工艺产线页面开关
          viewDialogFull:true,//预览工艺产线页面弹窗缩放开关（默认放大）
          articleNumber:null,//品号
          craftLineName:null,//工艺产线名称
          id:null,//工艺产线ID（主表数据ID）
          productLineTypeList:[],//产线类型集合
          productLineType:null,//产线类型
        }
      },
      computed: {
        ...mapGetters(['permissions']),
        permissionList() {
          return {
            addBtn: this.vaildData(this.permissions.pfoc_craftproductline_add, false),
            delBtn: this.vaildData(this.permissions.pfoc_craftproductline_del, false),
            editBtn: this.vaildData(this.permissions.pfoc_craftproductline_edit, false)
          }
        }
      },
      mounted() {
          //获取产线类型
          this.getProductLineTypeListData();

      },
      methods: {
        // 列表查询
        getList(page, params) {
          this.tableLoading = true
          fetchList(Object.assign({
            descs:"create_time",
            current: page.currentPage,
            size: page.pageSize
          }, params, this.searchForm)).then(response => {
            this.tableData = response.data.data.records
            this.page.total = response.data.data.total
            this.tableLoading = false
          }).catch(() => {
            this.tableLoading = false
          })
        },
        // 删除
        handleDel: function(row, index) {
            const h = this.$createElement;//①第一个参数为标签，即创建的节点元素的标签是什么 ②第二个参数是属性配置，如class、style等③第三个参数是节点元素的内容
            this.$confirm('提示', {
                title: '提示',
                message: h('div', [h('p', `产品工艺：【 ${row.productProcessName}】`), h('p',`品号：【${row.articleNumber}】 是否确认删除？`)]),
                confirmButtonText: '确定',
                cancelButtonText: '取消',
                type: 'warning'
          }).then(function() {
            return delObj(row.id)
          }).then(data => {
            this.$message.success('删除成功')
            this.getList(this.page)
          })
        },
        // 更新
        handleUpdate: function(row, index, done, loading) {
          putObj(row).then(data => {
            this.$message.success('修改成功')
            done()
            this.getList(this.page)
          }).catch(() => {
            loading()
          })
        },
        // 保存
        handleSave: function(row, done, loading) {
          addObj(row).then(data => {
            this.$message.success('添加成功')
            done()
            this.getList(this.page)
          }).catch(() => {
            loading()
          })
        },
        //新增工艺产线
        addCraft(){
            //打开新增工艺产线页面
            this.addDialogVisible = true;
        },
        //关闭新增工艺产线弹窗
        closeAddCraft(){
            //关闭新增工艺产线页面
            this.addDialogVisible = false;
            //刷新列表
            this.refreshChange();
        },
        //修改工艺产线
        editCraft(row){
          this.articleNumber=row.articleNumber;//品号
          this.craftLineName=row.craftLineName;//工艺产线名称
          this.productLineType =row.productLineType;//产线类型
          this.id = row.id;//工艺产线ID用于修改时查询数据
          //打开修改工艺产线页面
          this.editDialogVisible = true;
          this.$nextTick(() => {
              //调用修改页面工艺产线查询方法
              this.$refs.editCraftRef.getCraftProductLineDetails();
          })
        },
        //关闭修改工艺产线弹窗
        closeEditCraft(){
            //关闭新增工艺产线页面
            // this.editDialogVisible = false;
            //刷新列表
            this.refreshChange();
        },
        //预览
        handleView(row){
            this.articleNumber=row.articleNumber;//品号
            this.craftLineName=row.craftLineName;//工艺产线名称
            this.id = row.id;//工艺产线ID用于预览时查询数据
            //打开预览工艺产线页面
            this.viewDialogVisible = true;
            this.$nextTick(() => {
                //调用预览页面工艺产线查询方法
                this.$refs.viewCraftRef.getCraftProductLineDetails();
            })
        },
        // 每页条数改变事件
        sizeChange(pageSize) {
          this.page.pageSize = pageSize
        },
        // 当前页发生改变事件
        currentChange(current) {
          this.page.currentPage = current
        },
        // 查询事件
        searchChange(form, done) {
          this.searchForm = form
          this.page.currentPage = 1
          this.getList(this.page, form)
          done()
        },
        // 刷新事件
        refreshChange() {
          this.getList(this.page)
        },
        //  导出excel
        exportExcel() {
          this.downBlobFile('/pfoc/craftproductline/export', this.searchForm, 'craftproductline.xlsx')
        },
        //获取产品类型
        getProductLineTypeListData(){
            remote("product_line").then(response => {
                this.productLineTypeList=response.data.data;
            })
        },
        //产品发布
        productRelease(row,index){
            if(this.validatenull(row.standardWorkHours)){
                this.$message.warning('预发布产品未设定标准工时，请进行编辑设定标准工时后再次进行发布操作.')
                return;
            }

            const h = this.$createElement;//①第一个参数为标签，即创建的节点元素的标签是什么 ②第二个参数是属性配置，如class、style等③第三个参数是节点元素的内容
            this.$confirm('提示', {
                    title: '提示',
                    message: h('div', [h('p', `产品工艺：【 ${row.productProcessName}】`), h('p',`品号：【${row.articleNumber}】 是否确认发布？`)]),
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
              }).then(function() {
                  //调用产品发布方法
                return productProductionRelease(row.id)
              }).then(response => {
                  if(response.data.data == "success") {
                      this.$message.success('发布成功');
                  }else{
                      this.$message.warning('当前产品工艺已发布过，请先在产品发布管理中删除后再次进行发布。')
                  }
                  this.getList(this.page)
              })
        }
      }
}
</script>
